import { useEffect } from 'react';
import { ProFormText, ProFormSelect, ProForm, ProFormTextArea } from '@ant-design/pro-components';
import StorageManager from '@/utils/StorageManager';
import type { ProFormInstance } from '@ant-design/pro-components';

import AddObjectBtn from './addObjectBtn';
import ExtendedAtt from './extendedAtt';
import getProFileData from '../getProFileData';
import Config from '../configGroup';
import styles from './style.less';

type Props = {
  isModify?: boolean;
  isRead?: boolean;
  formRef: ProFormInstance | any;
};

const KeyInfo: React.FC<Props> = ({ isModify, isRead, formRef }) => {
  const { OptionsActivityProductkeyList, OptionsStoreTypeList, OptionsDaypartList } =
    getProFileData();

  const eunmList: any = StorageManager.getLocalStorageSync('eunmList');
  const OptionsScenarioList = eunmList?.OptionsScenarioList || [];

  // 枚举值查询
  useEffect(() => {
    // dispatch('queryOptionsExtandvalueIdList');
    // dispatch('queryOptionsScenarioList');
  }, []);

  return (
    <Config.Group id="key-info" title="键值信息">
      <div className={styles['wrap-body']}>
        <ProForm.Group>
          <ProFormSelect
            labelCol={{ span: 8 }}
            width="lg"
            name="productKey"
            label="键位模板"
            options={[{ label: '不用模版', value: 0 }, ...OptionsActivityProductkeyList]}
            placeholder="填写中"
            fieldProps={{
              allowClear: false,
            }}
          />
          {/* 占位 */}
          <div style={{ width: 1000 }} />
          {/* <ProFormText
            labelCol={{ span: 8 }}
            width={800}
            name="productId"
            label="产品ID"
            placeholder="productId"
            tooltip="多个产品ID请用 ||隔开，例：3389||2146||43678"
          />
          <ProFormText
            labelCol={{ span: 8 }}
            width={800}
            name="productIdRule"
            label="产品规则ID"
            placeholder="productIdRule"
          />
          <ProFormText
            labelCol={{ span: 8 }}
            width={800}
            name="productIdBackup"
            label="后备产品码"
            placeholder="productIdBackup"
          />
          <AddObjectBtn
            formRef={formRef}
            fatherName="productIdBackupEx"
            fatherLabel="后备产品码扩展属性"
          />
            placeholder="请输入"
          /> */}
          <ExtendedAtt formRef={formRef} fatherName="productIdEx" />
          <ExtendedAtt formRef={formRef} fatherName="productIdRuleEx" />
          <ExtendedAtt formRef={formRef} fatherName="productIdBackupEx" />
          <ProFormText
            labelCol={{ span: 8 }}
            // width="lg"
            width={700}
            name="conditioncate"
            label="门槛产品类别"
            placeholder="conditioncate"
          />
          {/* 占位 */}
          <div style={{ width: 500 }} />
          <ProFormTextArea
            labelCol={{ span: 8 }}
            width={700}
            name="productcate"
            label="适用产品类别"
            placeholder="productcate"
            fieldProps={{
              autoSize: {
                minRows: 2,
                maxRows: 4,
              },
            }}
          />
          <div style={{ width: 500 }} />
          <ProFormText
            disabled={true}
            labelCol={{ span: 8 }}
            width="lg"
            name="onlineCode"
            label="宅急送优惠CODE"
            placeholder="onlineCode"
          />
          {/* 占位 */}
          <div style={{ width: 500 }} />
          <ProFormText
            labelCol={{ span: 8 }}
            width="lg"
            name="paymentNameA"
            label="给顾客开票支付名称"
            placeholder="paymentNameA"
          />
          <ProFormText
            labelCol={{ span: 8 }}
            width="lg"
            name="paymentIdA"
            label="给顾客开票支付ID"
            placeholder="paymentIdA"
          />
          <ProFormText
            labelCol={{ span: 8 }}
            width="lg"
            name="paymentNameB"
            label="给第三方开票支付名称"
            placeholder="paymentNameB"
          />
          <ProFormText
            labelCol={{ span: 8 }}
            width="lg"
            name="paymentIdB"
            label="给第三方开票支付ID"
            placeholder="paymentIdB"
          />
          <ProFormText
            labelCol={{ span: 8 }}
            width="lg"
            name="discountName"
            label="折扣部分支付名称"
            placeholder="discountName"
          />
          <ProFormText
            labelCol={{ span: 8 }}
            width="lg"
            name="discountId"
            label="折扣部分支付ID"
            placeholder="discountId"
          />

          <ProFormText
            labelCol={{ span: 8 }}
            width="lg"
            name="actCode"
            label="支付宝卡包"
            placeholder="actCode"
          />
          <ProFormText
            labelCol={{ span: 8 }}
            width="lg"
            name="groupId"
            label="微信卡包"
            placeholder="groupId"
          />
          <ProFormText
            labelCol={{ span: 8 }}
            width="lg"
            name="qqCode"
            label="QQ卡包"
            placeholder="qqCode"
          />
          {/* 占位 */}
          <div style={{ width: 500 }} />
          <AddObjectBtn
            formRef={formRef}
            fatherName="paymentIdAEx"
            fatherLabel="给顾客开票支付ID扩展属性"
          />
          <AddObjectBtn
            formRef={formRef}
            fatherName="paymentIdBEx"
            fatherLabel="第三方支付开票ID扩展属性"
          />
          <AddObjectBtn
            formRef={formRef}
            fatherName="discountIdEx"
            fatherLabel="折扣部分支付ID扩展属性"
          />
          <ProFormSelect
            mode="multiple"
            labelCol={{ span: 8 }}
            width="lg"
            name="storeTypeIds"
            label="餐厅类型"
            options={OptionsStoreTypeList}
            placeholder="请选择"
            fieldProps={{
              maxTagCount: 'responsive',
            }}
          />
          <ProFormSelect
            mode="multiple"
            labelCol={{ span: 8 }}
            width="lg"
            name="scenarioIds"
            label="场景"
            options={OptionsScenarioList}
            placeholder="请选择"
            fieldProps={{
              maxTagCount: 'responsive',
            }}
          />
          <ProFormSelect
            mode="multiple"
            labelCol={{ span: 8 }}
            width="lg"
            name="daypartids"
            label="用餐时间ID"
            options={OptionsDaypartList}
            placeholder="请选择"
            fieldProps={{
              maxTagCount: 'responsive',
              listHeight: 350,
            }}
          />
          {/* 占位 */}
          <div style={{ width: 500 }} />
          <ProFormTextArea
            labelCol={{ span: 8 }}
            width={700}
            name="productGroupIdEx"
            label="产品组ID"
            placeholder="productGroupIdEx"
            fieldProps={{
              autoSize: {
                minRows: 2,
                maxRows: 4,
              },
            }}
          />
          <div style={{ width: 500 }} />
          <ProFormTextArea
            labelCol={{ span: 8 }}
            width={700}
            name="productTagGroupIdEx"
            label="产品组标签ID"
            placeholder="productTagGroupIdEx"
            fieldProps={{
              autoSize: {
                minRows: 2,
                maxRows: 4,
              },
            }}
          />
        </ProForm.Group>
      </div>
    </Config.Group>
  );
};

export default KeyInfo;
